<template>
  <div class="home">
    <van-nav-bar title="课程详情" left-arrow @click-left="left">
      <template #right>
        <van-icon name="cluster-o" />
      </template>
    </van-nav-bar>
    <div class="div1"></div>
    <div class="div2"></div>
    <div class="div3"></div>
    <div class="div4"></div>
    <van-button type="warning">立即报名</van-button>
  </div>
</template>

<script>
export default {
  // 组件状态值
  data() {
    return {};
  },
  // 生命周期
  mounted() {},
  // 组件方法
  methods: {
    left() {
      this.$router.push("/");
    },
  },
  // 计算属性
  computed: {},
  // 侦听器
  watch: {},
  // 过滤器
  filters: {},
  // 自定义指令
  directives: {},
};
</script> 

<style scoped>
.div1 {
  height: 90px;
  width: 100%;
  background: white;
  margin-bottom: 20px;
}
.div2 {
  height: 125px;
  width: 100%;
  background: white;
  margin-bottom: 20px;
}
.div3 {
  height: 80px;
  width: 100%;
  background: white;
  margin-bottom: 20px;
}
.div4 {
  height: 80px;
  width: 100%;
  background: white;
  margin-bottom: 20px;
}
.home {
  width: 100%;
  height: 650px;
  background: #f2f3f5;
}
.van-button{
  position: fixed;
  bottom: 0;
  background: #eb6100;
  width: 100%;
  z-index: 2;
  height: 50px;
}
</style>
